body,html{
    width: 100%;
    height: 100vh;
    background: #ccc;
}
li{
    list-style: none;
}
a{
    text-decoration: none;
}
.px2rem(@name, @px) {
    @{name}: @px / 75 * 1rem;
}
.dahezi{
    width: 100%;
    .px2rem(height,220);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    background: #fff;
      .hed{
          width: 100%;
          .px2rem(height,110);
          display: flex;
          ._left{
              width: 20%;
              .px2rem(height,110);
              display: flex;
              justify-content: center;
              align-items: center;
              .px2rem(font-size,38);
               span{
                   width: 40%;
                   img{
                       width: 50%;
                   }
               }
          }
          .cent{
              width: 65%;
              .px2rem(height,100);
              display: flex;
              justify-content: center;
              align-items: center;
              input{
                  width: 100%;
                  .px2rem(height,75);
                  .px2rem(font-size,32);
                  color: #ccc;
                  border: 1px solid #ccc;
                  border-radius: 50px;
                  outline: none;
                  box-shadow: 0 0 30px #ccc;
              }
             
          }
          ._right{
              width: 15%;
              .px2rem(height,110);
              display: flex;
              justify-content: center;
              align-items: center;
              .px2rem(font-size,38);
          }
    }
    .nav{
        width: 100%;
        ul{
            display: flex;
            justify-content: center;
            align-items: center;
            border-top: 1px solid #ccc;
            li{
            width: 25%;
            .px2rem(height,100);
            text-align:center;
            .px2rem(font-size,36);
            line-height: 2;
            font-weight: 800;
            color: #ccc;
            }
            .active{
            border-bottom:2px solid #ff4545;
            color:#ff4545;
            box-sizing:border-box;
            }
        }
    }
}
._lk{
   .px2rem(margin-top,220);
    .lki{
        .lsk{                
            width: 100%;
            .px2rem(height,310);
            img{
                width: 100%;
                height: 100%;
            }

        }
    }
    .swiper-pagination{
        width: 100%;
        .px2rem(height,25);
        span{
            .px2rem(width,20);
            .px2rem(height,20);
            border-radius: 50px;
        }
    }
}
.asw{
    .px2rem(padding-top,12);
    background: #fff;
    .aqw{
       .wq{
           width: 25%;
           .px2rem(height,120);
           display: flex;
           flex-direction: column;
           justify-content: center;
           align-items: center;
           p{
               .px2rem(font-size,58);

           }
           span{
               .px2rem(font-size,34);
               .px2rem(padding-top,16);
           }
       } 
    }
}           
.shenghuo{
    width: 100%;
    .px2rem(height,160);
    display: flex;
    background: #fff;
   .px2rem(margin-top,20);
      .zuomian{
          width: 22%;
          .px2rem(height,150);
          display: flex;
          justify-content: center;
          align-items: center;
          p{  
              width: 60%;
              .px2rem(font-size,46);
              .px2rem(height,115);
              color: goldenrod;
              width: 100%;
              border-right: 1px solid #ccc;
              padding: 0 10% 0 20%;
              box-sizing: border-box;
          }
      }
    .sx{
        width: 78%;
        .px2rem(height,155);
       .swiper-wrapper{
          .sc{
            width: 100%;
            .px2rem(height,155);
                .divs{
                    width: 100%;
                    display: flex;
                        ._divs-left{
                            width: 22%;
                            .px2rem(height,155);
                            .px2rem(padding-top,3);
                            img{
                              .px2rem(width,120);
                              .px2rem(height,140);            
                                padding: 4% 7%;
                                box-sizing: border-box;
                            }
                        }
                        ._div-right{
                            width: 78%;
                            .px2rem(height,155);
                            p{
                                .px2rem(font-size,36);
                                .px2rem(padding-top,28);
                            }
                        }
                }
            }
       } 
    }
}       
.meiwei{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    .px2rem(padding-top,23);
      ._meiwei{
          display: flex;
          flex-wrap: wrap;
          width: 48%;
          .px2rem(height,150);
          background: #fff;
          margin: 1% 1%;
          box-sizing: border-box;
            .fig{
                width: 30%;
                .px2rem(height,150);
                display: flex;
                justify-content: center;
                align-items: center;
                   img{
                      .px2rem(width,100);
                      .px2rem(height,110);
                       border-radius: 50%;
                   }
            }
            .wenzi{
                width: 70%;
                    h2{              
                        .px2rem(height,70);
                        .px2rem(font-size,40);
                        font-weight: bold;
                        line-height: 2
                    }
                    p{            
                        .px2rem(height,70);
                        .px2rem(font-size,36);
                        color: #ccc;
                        .px2rem(padding-left,12);
                        line-height: 1.5;
                    }
            }
           
      }
}
.tuijian{
    width: 100%;
    background: #fff;
    .px2rem(margin-top,20);
      .tuijiantop{
          width: 100%;
          .px2rem(height,140);
          text-align: center;
             h1{
                 .px2rem(font-size,42); 
                 font-weight: bold;   
                 line-height: 1.8;         
             }
             p{
                 .px2rem(font-size,34); 
                  line-height: 1.5;            
             }
      }
      .zhuanti{
          width: 100%;
          .px2rem(height,260);
          position: relative;
          display: flex;
          justify-content: center; 
          .px2rem(margin-top,14);  
        //    background: #fff;    
            img{
                width: 100%;
                .px2rem(height,260);
            }
            .zhuan{
                width: 100%;
                .px2rem(height,260);
                background: #000;
                opacity: .5;
                position: absolute;
                top: 0;
                left: 0;
                color: #fff;        
                 p{
                     .px2rem(font-size,38);
                 }
                 .pzt1{
                     transform: translate(10px);
                     font-weight: bold;
                     animation: a1 2s infinite;
                     box-sizing: border-box;
                 }
                  @keyframes a1 {
                        0% {
                            transform: translate(0);
                            opacity: 0;
                        }
                        50% {
                            transform: translate(20px);
                            opacity: 1;
                            color: skyblue;
                        }
                        70% {
                            transform: translate(40px);
                            opacity: 1;
                            color: firebrick;
                        }
                        100% {
                            transform: translate(60px);
                            opacity: 0;                   
                        }
                    }
                  .pzt2{
                        opacity: 0;
                        transform: translate(-60px);
                        animation: a2 2s infinite; 
                         box-sizing: border-box;             
                  }
                  @keyframes a2 {
                        0% { 
                            transform: translate(0px);
                            opacity: 0;
                        }
                        50% {
                            transform: translate(-10px);
                            opacity: 1;
                            color: violet;
                        }
                        70% {
                            transform: translate(-30px);
                            opacity: 1;
                            color: royalblue;
                        }
                        100% {
                            transform: translate(-60px);
                            opacity: 0;
                        }
                    }
                    .pzt2{
                        width: 80%;
                        position: absolute;
                        right: 0;
                        bottom: 10px;
                    }
                    .pzt1{
                        width: 90%;
                       .px2rem(padding-top,9);
                    }
            }
      }
}
.meiri{
    width: 100%;
    background: #fff;
    .px2rem(padding-bottom,130);
      .meiritop{
          width: 100%;
          .px2rem(height,140);
          text-align: center;
            h1{
                .px2rem(font-size,40);
                font-weight: bold;
                color: skyblue;
                line-height: 2;
            }
            p{
               .px2rem(font-size,32); 
               line-height: 1.2;
               color: #555;
            }
      }
    .shuchu{
        width: 100%;
        .px2rem(height,500);
           .mingcheng{
               width: 100%;
               .px2rem(height,80);
                  h3{
                      .px2rem(font-size,40);
                      font-weight: bold;
                      color: tomato;
                      .px2rem(padding-left,15);
                  }
           }
           .shutu{
               width: 100%;
               .px2rem(height,270);
                img{
                    width: 100%;
                   .px2rem(height,270);
                }
           }
           .shuxia{
                width: 100%;
               .px2rem(height,150);
                p{
                  .px2rem(font-size,36);
                  line-height: 2;
                  .px2rem(padding-left,15);
                }          
                .ltu{
                    width: 100%;
                    .px2rem(height,80);
                    display: flex;
                    justify-content: space-between;
                    .pn1{
                        display: flex;
                        width: 70%;
                        .px2rem(font-size,34);
                          .sp1{
                              color: red;
                          }
                            
                    }
                    .pn2{
                         width: 30%;
                         color: goldenrod; 
                    }
                } 
            }
    } 
} 
.font{
    width: 100%;
    .px2rem(height,130);
    background: #fff;
    position: fixed;
    bottom: 0;
    left: 0;
    display: flex;
    z-index: 200;
    border-top: 3px solid #ccc;
    a{
         width: 25%;
        .px2rem(height,130);
        dl{
            width: 100%;
            .px2rem(height,130);
            text-align: center;
            dt{
                .px2rem(font-size,60);
                .px2rem(padding-top,15);
            }
            dd{
                .px2rem(font-size,34);
                .px2rem(padding-top,15);
            }
        }
    }
   
}

